<!-- templates/index.html -->
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>极简图书管理系统</title>
    <!-- 引入 Bootstrap CSS（可选，如果不想使用，只保留纯 HTML 也行） -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
</head>
<body>
<div class="container mt-4">
    <h1 class="mb-4">极简图书管理系统</h1>

    <!-- 显示可能存在的错误提示 -->
    {% if error %}
        <div class="alert alert-danger">{{ error }}</div>
    {% endif %}

    <!-- 新增图书表单 -->
    <div class="card mb-4">
        <div class="card-body">
            <form method="post" action="{{ url_for('add_book') }}">
                <div class="form-row">
                    <div class="col">
                        <input type="text" class="form-control" name="title" placeholder="书名">
                    </div>
                    <div class="col">
                        <input type="text" class="form-control" name="author" placeholder="作者">
                    </div>
                    <div class="col-auto">
                        <button type="submit" class="btn btn-primary">添加图书</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <!-- 图书列表 -->
    <table class="table table-bordered">
        <thead class="thead-light">
            <tr>
                <th>ID</th>
                <th>书名</th>
                <th>作者</th>
                <th>状态</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
        {% for book in books %}
            <tr>
                <td>{{ book.book_id }}</td>
                <td>{{ book.title }}</td>
                <td>{{ book.author }}</td>
                <td>
                    {% if book.is_borrowed %}
                        <span class="badge badge-danger">已借出</span>
                    {% else %}
                        <span class="badge badge-success">在架上</span>
                    {% endif %}
                </td>
                <td>
                    <!-- 借出按钮：若已借出，则禁用 -->
                    <form method="post" action="{{ url_for('borrow_book', book_id=book.book_id) }}" style="display:inline;">
                        <button type="submit" class="btn btn-sm btn-warning"
                                {% if book.is_borrowed %} disabled {% endif %}>
                            借 出
                        </button>
                    </form>
                    <!-- 归还按钮：若在架上，则禁用 -->
                    <form method="post" action="{{ url_for('return_book', book_id=book.book_id) }}" style="display:inline;">
                        <button type="submit" class="btn btn-sm btn-success"
                                {% if not book.is_borrowed %} disabled {% endif %}>
                            归 还
                        </button>
                    </form>
                    <!-- 删除按钮：始终可用 -->
                    <form method="post" action="{{ url_for('delete_book', book_id=book.book_id) }}" style="display:inline;">
                        <button type="submit" class="btn btn-sm btn-danger">删 除</button>
                    </form>
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>

    <!-- 如果没有任何图书，显示一行提示 -->
    {% if books|length == 0 %}
        <p class="text-center">当前没有任何图书，快去添加吧！</p>
    {% endif %}
</div>

<!-- 引入 Bootstrap JS（可选） -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
